<template>
  <a-modal :open="open" width="1200px" title="出入库明细" centered :footer="null" @cancel="onCancel">
    <a-form class="form-style-flex" name="validate_other" :model="formState">
      <a-form-item name="dateRange" label="操作日期">
        <a-range-picker v-model:value="formState.dateRange" class="w-64" format="YYYY-MM-DD " value-format="YYYY-MM-DD" @change="getData()" />
      </a-form-item>
      <a-form-item name="lsh" label="" class="ml-3">
        <a-input v-model:value="formState.lsh" class="w-64" placeholder="流水单号" @blur="getData()" />
      </a-form-item>
      <div class="flex-1 text-right">
        <BaseExport
          type="物资"
          name="物品库存查询明细"
          code="000324"
          :search-params="{
            stdate: formState.dateRange?.[0],
            eddate: formState.dateRange?.[1],
            lsh: formState.lsh,
            zjm: formState.ypbh,
            ckbhStr: rowData?.ckbh
          }"
          class="mb-2"
          >导出</BaseExport
        >
      </div>
    </a-form>
    <div>
      <BaseTable :data-source="tableData" :height="600" :loading="loading" :scroll="{ x: 1400 }" column-code="000324" :pagination="pagination">
        <template #bodyCell="{ column, index, record }">
          <template v-if="column.dataIndex === 'xh'">
            {{ index + 1 }}
          </template>
          <template v-if="column.dataIndex === 'ypmc'">
            <MedicineInfo :value="{ mc: record.ypmc, gg: record.gg, cj: record.cj }" />
          </template>
        </template>
      </BaseTable>
    </div>
  </a-modal>
</template>
<script setup>
import dayjs from 'dayjs'

const emit = defineEmits(['update:open', 'update:value', 'success'])

const props = defineProps({
  open: {
    type: Boolean,
    default: false
  },
  rowData: {
    type: Object,
    default: () => ({})
  }
})

const { loading, tableData, getData, pagination } = useTable({
  url: '/materials/psiform/getStoreRecordsList',
  immediate: false,
  formatParams: () => {
    return {
      stdate: formState.value.dateRange?.[0],
      eddate: formState.value.dateRange?.[1],
      lsh: formState.value.lsh,
      zjm: formState.value.ypbh,
      ckbhStr: props.rowData?.ckbh
    }
  }
})
const formState = ref({
  dateRange: [dayjs().format('YYYY-MM-DD'), dayjs().format('YYYY-MM-DD')],
  lsh: '',
  zjm: ''
})
watch(
  () => props.open,
  (val) => {
    if (val) {
      if (props.rowData?.ypbh) {
        formState.value.ypbh = props.rowData?.ypbh
        getData()
      }
    }
  }
)

const onCancel = () => {
  emit('update:open', false)
  formState.value = {
    dateRange: [dayjs().format('YYYY-MM-DD'), dayjs().format('YYYY-MM-DD')],
    lsh: '',
    zjm: ''
  }
}
</script>
<style lang="less" scoped></style>
